// 0. 如果使用模块化机制编程，导入Vue和VueRouter，要调用 Vue.use(VueRouter)
import Vue from "vue";
import VueRouter from "vue-router";
Vue.use(VueRouter);
// 1. 定义 (路由) 组件。
//引入一级组件
const Dashboard = () => import("../views/dashboard/Dashboard");
const Login = () => import("../views/user/login");
const Search = () => import("../views/search/index");
const NotFound = () => import("../views/notFound/NotFound");
const Details = () => import("../views/details/Details");
const Setting = () => import("../views/user/setting/Setting");

//引入二级组件
const Home = () => import("../views/home/Home");
const Cart = () => import("../views/cart/Cart");
const Category = () => import("../views/category/Category");
const Mine = () => import("../views/mine/Mine");
const SearchInput = () => import("../views/search/Search");
const SearchRes = () => import("../views/search/SearchRes");
const UserInfoList = () =>
  import("../views/user/setting/children/UserInfoList");
const UserPwdUpdata = () =>
  import("../views/user/setting/children/UserPwdUpdata");
const UserTelUpdata = () =>
  import("../views/user/setting/children/UserTelUpdata");
const UserNick = () => import("../views/user/setting/children/UserNick");
const UploadAvatar = () =>
  import("../views/user/setting/children/UploadAvatar");

const routes = [
  {
    path: "/",
    redirect: "/dashboard",
  },
  {
    path: "/dashboard",
    component: Dashboard,

    children: [
      { path: "/", redirect: "home" },
      { path: "home", name: "home", component: Home, meta: { active: 0 } },
      { path: "cart", component: Cart, name: "cart", meta: { active: 2 } },
      {
        path: "category",
        component: Category,
        name: "category",
        meta: { active: 1 },
      },
      { path: "mine", component: Mine, name: "mine", meta: { active: 3 } },
    ],
  },
  {
    path: "/search",
    component: Search,
    children: [
      { path: "/", redirect: "searchinput" },
      { path: "searchinput", component: SearchInput },
      { path: "searchres", component: SearchRes, name: "searchres" }, //query传参
      //{ path: "searchres/:keywords", component: SearchRes }, //params传参
    ],
  },
  {
    path: "/login",
    component: Login,
  },
  {
    path: "/details/:id",
    name: "details",
    component: Details,
  },

  //   //设置
  {
    path: "/setting",
    component: Setting,
    children: [
      { path: "/", redirect: "userinfolist" },
      { path: "userinfolist", component: UserInfoList },
      { path: "userpwdupdata", component: UserPwdUpdata },
      { path: "uploadavatar", component: UploadAvatar },

      { path: "usernick", component: UserNick },
      { path: "usertelupdata", component: UserTelUpdata },
    ],
  },
  {
    path: "*",
    component: NotFound,
  },
];

// 3. 创建 router 实例，然后传 `routes` 配置
// 你还可以传别的配置参数, 不过先这么简单着吧。
const router = new VueRouter({
  routes, // (缩写) 相当于 routes: routes
});

// 4. 导出router实例。
export default router;
